<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" > <!--<![endif]-->
<head>
</head>
<body>
<table class="table table-bordered table-striped table-highlight">
						        <thead>
						          <tr>
						            <th>#</th>
						            <th>登录名</th>
						            <th>用户名</th>
						            <th>地市</th>
						            <th>区县</th>
						            <th>所属机构</th>
						          </tr>
						        </thead>
						        <tbody>

						        </tbody>
						      </table>
					<div class="pagination">

					</div>
        <script type="text/javascript">
            function gotoPage(toPage){
                $.getJSON(CONTEXTPATH + "/demo/list",{currentPage:toPage,pageSize:20}, function(json){
                    var pages = json.obj;
                    //初始化数据列表 pages.ITEMS
                    for(var i=0;i<pages.ITEMS.length;i++){
                        var element = pages[i];
                        var tr = $("<tr></tr>");
                        tr.appendhtml("<td>"+element.F_LOGIN_NAME+"</td>");
                        tr.appendhtml("<td>"+element.F_USER_NAME+"</td>");
                        tr.appendhtml("<td>"+element.F_AREA_NUM+"</td>");
                        tr.appendhtml("<td>"+element.F_REGION_NUM+"</td>");
                        tr.appendhtml("<td>"+element.F_ORG_NUM+"</td>");
                        $("table.tbody").append(tr);
                    }
                    //初始化分页 pages.TOTALS
                    var pageul = $("<ul></ul>");
                    var Prev = pages.CURRENT - 1 <= 1 ? 1:pages.CURRENT - 1;
                    pageul.append("<li><a href=\"javascript:gotoPage("+ Prev +");\">上一页</a></li>");//Next
                    for(var i=1;i<=pages.TOTALPAGE ;i++){
                        var isActive="";
                        if(pages.CURRENT == i){
                            isActive = "class=\"active\"";
                        }
                        pageul.append("<li "+isActive+"><a href=\"javascript:javascript:gotoPage("+i+");;\">"+i+"</a></li>");
                    }
                    var Next =pages.CURRENT + 1 >= pages.TOTALPAGE ? pages.TOTALPAGE:pages.CURRENT + 1;
                    pageul.append("<li><a href=\"javascript:"+Next+";\">下一页</a></li>");//Prev
                    $(".pagination").empty().append(pageul);
                });
            }
            $(document).ready(function(){
                gotoPage(1);
            });
        </script>
</body>
</html>